import React, { useState } from "react";
import { delay } from "./utils";

const RequestTracker: React.FC = () => {
  const [pending, setPending] = useState(0);
  const [completed, setCompleted] = useState(0);

  async function handleClick() {
    setPending(p => p + 1);
    await delay(3000);
    setPending(p => p - 1);
    setCompleted(c => c + 1);
  }

  return (
    <>
      <h3>等待：{pending}</h3>
      <h3>完成：{completed}</h3>
      <button onClick={handleClick}>购买</button>
      <h3>完成：{completed}</h3>
    </>
  );
};
export default RequestTracker;
